/*
 * @Author: master
 * @Date: 2021-04-13 21:09:32
 * @LastEditTime: 2021-09-26 09:23:03
 * @Description: 动画css
 */
@import './keyframes.less';
.animationStatus {
  &::after {
    animation: antStatusAnimate 1.2s ease-in-out infinite;
  }
}
.animationLeftToRight {
  animation-name: MoveLeftToRight;
  animation-duration: 0.3s;
  animation-timing-function: ease-in;
}
.animationRightToLeft {
  animation-name: MoveRightToLeft;
  animation-duration: 0.3s;
  animation-timing-function: ease-in;
}
.animationTopToDown {
  animation-name: MoveTopToDown;
  animation-duration: 0.3s;
  animation-timing-function: ease-in;
}
.animationDownToTop {
  animation-name: MoveDownToTop;
  animation-duration: 0.3s;
  animation-timing-function: ease-in;
}
.animationOpacity {
  animation-name: opacity;
  animation-duration: 0.5s;
  animation-timing-function: ease-in;
}
.animationOpacityChange {
  animation: fade 3s infinite;
}
// 左侧隐藏
.transform-to-left-hide {
  animation: left-hide 0.4s forwards;
}
// 左侧显示
.transform-to-left-show {
  animation: left-show 0.4s forwards;
}
// 右侧自适应
.transform-to-right-auto {
  animation: right-auto 0.4s forwards;
}
// 右侧恢复
.transform-to-right-recover {
  animation: right-recover 0.4s forwards;
}
// 左右抖动
.animate__animated__tada {
  animation-duration: 1s;
  animation-name: tada;
  animation-fill-mode: both;
}
// 页面滑入
.page-slideIn {
  animation: slideIn 0.2s forwards;
}
// 页面滑出
.page-slideOut {
  animation: slideOut 0.4s forwards;
}
// 摆动动画
.swing {
  animation: swing 1s ease;
  animation-iteration-count: 1;
}
// 颜色渐变动画
.text-progress-color-trans {
  background-image: -webkit-linear-gradient(
    left,
    #3498db 0%,
    #f47920 10%,
    #d71345 20%,
    #f7acbc 30%,
    #ffd400 40%,
    #3498db 50%,
    #f47920 60%,
    #d71345 70%,
    #f7acbc 80%,
    #ffd400 90%,
    #3498db 100%
  );
  font-size: 16px;
  font-weight: bold;
  color: transparent;
  background-size: 200% 100%;
  background-clip: text;
  text-align: center;
  animation: textProColorTrans 3s infinite linear;
}
